.movie-recommend-nav-container {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100vh;
  background: linear-gradient(135deg, #777fd1, #fbe5ea,#777fd1);
}

/* 按钮组样式 */
.button-group {
  display: flex;
  flex-direction: column;
  gap: 50px;
  justify-content: center;
  align-items: center; 
  height: 100%;
  /* padding: 40px 20px; */
}

/* 电影推荐按钮样式 */
.movie-recommend-nav-button {
  /* 尺寸和布局 */
  border-radius: 30px;
  height: 200px;
  width: 850px;

  /* 文本字体 */
  color: rgb(255, 255, 255);
  font-size: 80px;
  font-weight: 900;
  
  /* 添加阴影和荧光效果 */
  text-shadow: 
    3px 3px 6px rgba(100, 100, 100, 0.5),
    0 0 6px rgba(222, 217, 243, 0.7),
    0 0 10px rgba(140, 153, 252, 0.968),
    0 0 15px rgba(100, 100, 255, 0.6);
  
  /* 增加立体感 */
  position: relative;
  z-index: 1;
  
  
  /* 边框和阴影 */
  box-shadow: 8px 8px 10px rgba(0, 0, 0, 0.3);
  
  /* 定位和溢出控制 */
  position: relative;
  overflow: hidden;
  
  /* 过渡效果 */
  transition: all 0.3s ease;
  
  /* 背景图片 */
  background-size: cover;
  background-position: center;
  
  /* 图标和文字布局 */
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 20px;

  /* 黑色半透明遮罩 */
  background-color: rgba(0, 0, 0, 0.2);
  background-blend-mode: overlay;
}

.movie-recommend-nav-button.A {
  background-image: url('../../public/post/post-hot.jpg');
}
.movie-recommend-nav-button.A:hover {
  background-position: center top;
}

.movie-recommend-nav-button.B {
  background-image: url('../../public/post/post-upcoming.jpg');
}
.movie-recommend-nav-button.B:hover {
  background-position: center top;
}

.movie-recommend-nav-button.C {
  background-image: url('../../public/post/post-personalized.jpg');
}
.movie-recommend-nav-button.C:hover {
  background-position: center top;
}

/* 电影推荐按钮悬停效果 */
.movie-recommend-nav-button.ant-btn:hover {
  background-color: rgba(0, 0, 0, 0); 
  background-blend-mode: overlay;
  color: rgba(255, 255, 255, 1);
  box-shadow: 20px 20px 25px rgba(0, 0, 0, 0.3),
              inset 0 0 30px rgba(255, 255, 255, 0.2);
  border-color: rgba(255, 255, 255, 0.5);
}


/* 电影卡片样式 */
.movie-recommend {
  padding: 20px;
}

/* 卡片样式 */
.movie-recommend .ant-card {
  border-radius: 15px;
  box-shadow: 4px 4px 8px rgba(0, 0, 0, 0.1);
  padding: 20px;
  background-color: rgba(255, 255, 255, 0.5);
  backdrop-filter: blur(5px);
  transition: box-shadow 0.3s ease;
}

.movie-recommend .ant-card:hover {
  box-shadow: 8px 8px 8px rgba(0, 0, 0, 0.2);
  background-color: rgba(255, 255, 255, 0.8);
}

.movie-recommend .ant-card-cover {
  height: 300px;
  margin: 0 auto;
  overflow: hidden;
}

.movie-recommend .ant-card-cover img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.3s;
}

.movie-recommend .ant-card-cover img:hover {
  transform: scale(1.05);
}

.movie-recommend .ant-card-meta-title {
  margin: 12px 0 8px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.movie-recommend .ant-rate {
  margin-right: 8px;
}

.movie-recommend .ant-typography-secondary {
  font-size: 12px;
}

.movie-recommend-col {
  padding: 16px;
  display: flex;
}

.movie-recommend-movie-info {
  margin-bottom: 8px;
}
.movie-recommend-rating {
  display: flex;
  align-items: center;
}
.movie-recommend-loading {
  text-align: center;
  padding: 100px 0;
}
.movie-recommend-error {
  text-align: center;
  color: red;
  padding: 50px 0;
}

/* 返回按钮样式 */
.movie-recommend-back-button:focus,
.movie-recommend-back-button {
  position: relative;
  top: 0px;
  left: 8px;
  background: linear-gradient(135deg, #a3bdfa 0%, #999bfa 100%);
  color: white;
  border: none;
  border-radius: 20px;
  font-weight: bold;
  font-size: 14px;
  padding: 6px 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  white-space: nowrap;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
  cursor: pointer;
  transition: all 0.2s ease;
  z-index: 1000;
  height: auto;
  width: auto;
  max-width: 200px;
}

.movie-recommend-back-button:hover:not(:active) {
  transform: scale(1.05);
  background: linear-gradient(135deg, #86a6f2 0%, #7678dc 100%);
  color: white;
}
.movie-recommend-back-button .anticon {
  margin-right: 4px;
}

/* 电影详情页 */
/* 详情卡片样式*/
.movie-recommend-detail .ant-card {
  border-radius: 10px;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  padding: 20px;
  background-color: rgba(255, 255, 255, 0.5);
  backdrop-filter: blur(5px);
}

.movie-recommend-detail.ant-card:hover {
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1) !important;
  background-color: rgba(255, 255, 255, 0.5) !important;
}

/* 海报图片样式 */
.movie-recommend img {
  width: 100%;
  height: auto;
  border-radius: 5px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

/* 加载中样式 */
.loading-container {
  text-align: center;
  padding: 100px 0;
}

/* 错误信息样式 */
.error-container {
  text-align: center;
  color: red;
  padding: 50px 0;
}

/* 导演和剧情简介样式 */
.movie-recommend .director,
.movie-recommend .description {
  font-size: 19px;
  margin-top: 16px;
}

/* 评分样式 */
.movie-recommend .rating-container {
  display: flex;
  align-items: center;
  margin-top: 8px;
}

.movie-recommend .rating-value {
  margin-left: 8px;
  font-weight: bold;
}